@each $id, $color in (1, #333333),
  (2, #666666),
  (3, #999999),
  (4, #ffffff),
  (red, #e9142b),
  (blue, #519dda),
  (orange, #ff5400) {
  .color-#{$id} {
    color: $color !important;
  }
}

$hlist: h1, h2, h3, h4, h5, h6;
@for $i from 1 through 6 {
  #{nth($hlist, $i)} {
    font-size: nth($font-size-list, $i);
    font-weight: 500;
    margin: 5px 0;
  }
  .size-#{$i} {
    font-size: nth($font-size-list, $i);
  }
}

@mixin size-weight {
  font-weight: 500;
}

@mixin font-nowrap {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.text-over {
  text-overflow: -o-ellipsis-lastline;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
}
